<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!doctype html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="initial-scale=1,minimum-scale=1,maximum-
scale=1,user-scalable=no"/>
    <meta name="format-detection"
          content="telephone=no,address=no,email=no"/>
    <meta name="keywords" content="" />
    <meta name="description" content="" />
    <title>KAA电商管理后台_商品列表</title>
    <script type="text/javascript" src="${path}/js/jquery-2.1.1.min.js"></script>
    <script src="${path}/js/sidebar-menu.js"></script>
    <link href="${path}/css/login.css" rel="stylesheet" media="all">
<script language="javascript">
    function checkboxAll() {
        var checkstr = "";
        $("input:checkbox[name=id]:checked").each(function (i) {
            if (checkstr != "") {    //将所选的各项记录的id形成字符串，并以“，”分割
                checkstr += ",";
            }
            checkstr += $(this).val();
        });
        $("#checkBoxId").val(checkstr)
    }
    /* 是否全选标记 */
    var checkedAll = false;
    /* 全选/取消全选
     * formName 所在form的name值
     * checkboxName checkbox的name值
     * 注意：所有checkbox的name值都必须一样，这样才能达到全选的效果
     */
    function selectAll(form1, id) {
        var form = document.all.item(form1);
       /* var elements = form.elements[id];*/
        var elements = document.getElementsByTagName("input");
        for (var i = 0; i < elements.length; i++) {
            var e = elements[i];
            if (checkedAll) {
                e.checked = false;
                form.alls.checked = false;
            } else {
                e.checked = true;
                form.alls.checked = true;
                var checkstr = "";
                $("input:checkbox[name=id]:checked").each(function (i) {
                    if (checkstr != "") {    //将所选的各项记录的id形成字符串，并以“，”分割
                        checkstr += ",";
                    }
                    checkstr += $(this).val();
                });
                $("#ids").val(checkstr)
                $("#ids1").val(checkstr)
                $("#ids2").val(checkstr)
            }
        }
        if (checkedAll) {
            checkedAll = false;
        } else {
            checkedAll = true;
        }
    }

    function category(value){
        $("#categoryName").val(value)
        document.getElementById("form7").submit();

    }

    function subCategory(value){
        $("#subCategoryName").val(value)
        document.getElementById("form8").submit();

    }

    function colorSize(value){
        $("#colorSizeName").val(value)
        document.getElementById("form9").submit();

    }

    function sell(value){
        $("#sell").val(value)
        document.getElementById("form10").submit();
        /*$.ajax({
            type : "post",
            url : "${path}/productList?sell="+value+"",
            data : "sell="+ value,
            success:function(date){
                $("#pageCotent").html(date);
            },
        });*/
    }

</script>
<body class="main" id="pageCotent">
<h1>KAA电商管理后台</h1>
<jsp:include page="sidebarNav.jsp"></jsp:include>
<!-- main_sidebar -->

<div class="main_con_wrap">
    <form name="form1" method="post"
          action="${path}/productList" id="form1">
    <div class="main_con_top1 goodslist_top1">
        <%--<p class="outline_in"><a>添加商品</a></p>--%>
        <p class="del_all"><label for="del_all"></label>
            <%--<input onclick="selectAll()" type="checkbox"   name="controlAll" id="controlAll"/>全选<br>--%>
            <input name="alls" type="checkbox" onClick="selectAll('form1','id')"/><span>全选</span></p>
           <%-- <input type="checkbox" name="alls" onClick="selectAll('form1','id')"title="全选/取消全选">全选/取消全选--%>
        <p class="outline_in"><input type="button" onclick="delAll()"
                                     value="批量删除" /></p>
        <p class="outline_in"><input type="button" id="On_Shelf"
                                     onclick="sellAll()" value="批量上架"></p>
        <p class="outline_in"><input type="button" id="Off_Shelf"
                                     onclick="sellAlls()" value="批量下架"></p>
        <p class="recycle_bin"><a href="${path}/recycleBin?pageNo=1"></a></p>
        <div class="search_wrap">
            <form id="goods_search" name="goods_search" action="${path}/productList "
                  method="get">
                <div class="search_fl">
                    <input type="text" placeholder="搜索商品名称"
                           name="productName"id="productName" class="search_txt"  value="${productName}">
                </div>
                <input type="submit" value="" name="goods_search_btn"
                       class="search_btn">
            </form>
        </div>
        <div class="clear"></div>
    </div><!-- main_con_top1 -->
    <div class="main_con goods_list">
        <div class="main_con_top2 goodslist_top2">
            <p>
                    <select id="goodslist_category" onchange="category(this.value);">
                        <option value=""${categoryName == null ? 'selected':""}>选择品类</option>
                        <c:forEach items="${categoryList}" var="item">
                        <option value="${item.categoryName}" ${categoryName == item.categoryName ? 'selected':""}>${item.categoryName}</option>
                        </c:forEach>
                    </select>
            </p>
            <p>
                    <select id="goodslist_series" onchange="subCategory(this.value);">
                        <option value=""${subCategoryName == null ? 'selected':""}>选择系列</option>
                        <c:forEach items="${subCategoryList}" var="item1">
                        <option value="${item1.subCategoryName}"${subCategoryName == item1.subCategoryName ? 'selected':""}>${item1.subCategoryName}</option>
                        </c:forEach>
                    </select>
            </p>

            <p>
                    <select id="goodslist_standard" onchange="colorSize(this.value);">
                        <option value=""${colorSizeName == null ? 'selected':""}>规格</option>
                        <c:forEach items="${colorSizeList}" var="item2">
                        <option value="${item2.colorSizeName}"${colorSizeName == item2.colorSizeName ? 'selected':""}>${item2.colorSizeName}</option>
                        </c:forEach>
                    </select>
            </p>

            <p>
                <select id="goodslist_shelf" onchange="sell(this.value);">
                    <option value=""${sell == null ? 'selected':""}>选择上下架</option>
                    <option value="1"${sell == 1 ? 'selected':""}>上架</option>
                    <option value="0"${sell == 0 ? 'selected':""}>下架</option>
                </select>
            </p>
           <%-- <div class="excelbut"><input class="excelout" id="excelbut1"
                                         type="button" value="" onclick="javascript:method('goodslist_table')"
            /></div>--%>
            <span class="clear"></span>
        </div><!-- main_con_top2 -->
        <table id="goodslist_table" align="center" border="0" cellpadding="0"
               cellspacing="1" width="100%" >
            <tr class="TT">
                <%--<th>选择<input type="checkbox" onclick="chk('all',this)"
                             style="display:none;"/></th>--%>
                    <th>选择<input name="id" id="Checkbox1"
                                 onclick="checkboxAll();" value="" class="np"
                                 style="display: none;" type="checkbox">
                    </th>
                <th>商品名称</th>
                <th>分类规格</th>
                <th>销售价</th>
                <th>库存</th>
                <th>状态</th>
                <th>操作</th>
            </tr>
            <tbody>
            <c:forEach items="${productList}"  var="items">
                <tr>
                    <td><input name="id" id="id" onclick="checkboxAll();"
                                  value="${items.id}" class="np" type="checkbox"></td>
                    <td><span>${items.productName}</span><input type="text"
                                                                style="display:none;"></td>
                    <td><span>${items.categoryName}/${items.colorSizeName}
                        </span><input type="text" style="display:none;"></td>
                    <td><span>${items.nowPrice}</span><input type="text"
                                                             style="display:none;"></td>
                    <td><span>${items.stocks}</span><input type="text"
                                                           style="display:none;"></td>
                    <c:if test="${items.sell==1}">
                        <td><span>上架</span><input type="text"
                                                  style="display:none;"></td>
                    </c:if>
                    <c:if test="${items.sell==0}">
                        <td><span>下架</span><input type="text"
                                                  style="display:none;"></td>
                    </c:if>
                    <td class="last_td">
                        <input class="cose_but" value="查看" onclick="details(${items.id})"
                               type="button">
                        <input class="del_but" value="删除" onclick="del(${items.id})"
                               type="button">
                        <input class="edit_but" value="修改" onclick="updateProduct(${items.id})"
                                type="button">
                    </td>
                </tr>
            </c:forEach>
           <%-- <tr>
                <input name="alls" type="checkbox" onClick="checkedAll()"/><span>全选</span>
            </tr>--%>
            </tbody>
        </table>
        <div class="paging_wrap paging" onselectstart="return false" >
            <%--<td colspan="6" align="center" bgcolor="#5BA8DE">共${page.totalRecords}条
                记录 共${page.totalPages}页 当前第${page.pageNo}页<br>--%>
            <div class="otherBtns">
                <a class="onepage" value="首页"href="${path}/productList?pageNo=${page.topPageNo }">首页</a>
                <c:choose>
                <c:when test="${page.pageNo!=1}">
                <a class="prevpage" value="上一页" name="previousPage" href="${path}/productList?pageNo=${page.previousPageNo}"></a>
                </c:when>
                <c:otherwise>
                    <a class="prevpage" value="上一页" name="previousPage"></a>
                </c:otherwise>
                </c:choose>
            </div>
            <div class="otherBtns">
                <c:choose>
                <c:when test="${page.pageNo != page.totalPages}">
                <a class="nextpage" value="下一页"  href="${path}/productList?pageNo=${page.nextPageNo}"></a>
                </c:when>
                    <c:otherwise>
                        <a class="nextpage" value="下一页" ></a>
                    </c:otherwise>
                </c:choose>
                <a value="尾页" href="${path}/productList?pageNo=${page.bottomPageNo }">尾页</a>
            </div>
            <div class="jumpBtns" style="display:none;">
                <input class="jump_input" data="" type="text">
                <a class="jump_a" data="0">跳转</a>
            </div>
            <br><br>
            <td colspan="6" align="center" bgcolor="#5BA8DE">共${page.totalRecords}条
                记录 共${page.totalPages}页 当前第${page.pageNo}页<br>
        </div>
    </div><!-- main_con -->
    </form>
    <form name="form2" method="post"
          action="${path}/deleteProduct" id="form2"
          class="form2">
        <input name="ids" id="ids" type="hidden">
    </form>
    <form name="form3" method="post"
          action="${path}/sellProduct" id="form3"
          class="form3">
        <input name="ids1" id="ids1" type="hidden">
    </form>
    <form name="form4" method="post"
          action="${path}/noSellProduct" id="form4"
          class="form4">
        <input name="ids2" id="ids2" type="hidden">
    </form>
    <form name="form5" method="post"
          action="${path}/toProductDetails" id="form5"
          class="form5">
        <input name="productId" id="productId" type="hidden">
    </form>

    <form name="form6" method="post"
          action="${path}/toUpdateProductDetails" id="form6"
          class="form6">
        <input name="pId" id="pId" type="hidden">
    </form>
    <form name="form7" method="post"
          action="${path}/productList" id="form7"
          class="form7">
        <input name="categoryName" id="categoryName" type="hidden">
    </form>
    <form name="form8" method="post"
          action="${path}/productList" id="form8"
          class="form8">
        <input name="subCategoryName" id="subCategoryName" type="hidden">
    </form>
    <form name="form9" method="post"
          action="${path}/productList" id="form9"
          class="form9">
        <input name="colorSizeName" id="colorSizeName" type="hidden">
    </form>
    <form name="form10" method="post"
          action="${path}/productList" id="form10"
          class="form10">
        <input name="sell" id="sell" type="hidden">
    </form>
</div><!-- main_con_wrap -->

<div class="footer_copyright">
    <p>苏州知行合一网络科技有限公司提供技术支持，版权所有</p>
</div><!-- footer_copyright -->

<script>
    /////////////////////////侧边栏按钮
    $.sidebarMenu($('.sidebar-menu'))

    function del(value){
        $("#ids").val(value)
        document.getElementById("form2").submit();
    }

    function details(value) {
        $("#productId").val(value);
        document.getElementById("form5").submit();
    }

    function updateProduct(value) {
        $("#pId").val(value);
        document.getElementById("form6").submit();
    }

    function delAll(){
        var elements = document.getElementsByTagName("input");
        for (var i = 0; i < elements.length; i++) {
            var checkstr = "";
            $("input:checkbox[name=id]:checked").each(function (i) {
                if (checkstr != "") {    //将所选的各项记录的id形成字符串，并以“，”分割
                    checkstr += ",";
                }
                checkstr += $(this).val();
            });
            $("#ids").val(checkstr)
        }
        document.getElementById("form2").submit();
    }

    function sellAll() {
        var elements = document.getElementsByTagName("input");
        for (var i = 0; i < elements.length; i++) {
            var checkstr = "";
            $("input:checkbox[name=id]:checked").each(function (i) {
                if (checkstr != "") {    //将所选的各项记录的id形成字符串，并以“，”分割
                    checkstr += ",";
                }
                checkstr += $(this).val();
            });
            $("#ids1").val(checkstr)
        }
        document.getElementById("form3").submit();

    }
    function sellAlls() {
        var elements = document.getElementsByTagName("input");
        for (var i = 0; i < elements.length; i++) {
            var checkstr = "";
            $("input:checkbox[name=id]:checked").each(function (i) {
                if (checkstr != "") {    //将所选的各项记录的id形成字符串，并以“，”分割
                    checkstr += ",";
                }
                checkstr += $(this).val();
            });
            $("#ids2").val(checkstr)
        }
        document.getElementById("form4").submit();

    }
</script>
</body>
</head>
</html>